<template xmlns:el-table-column="http://www.w3.org/1999/html">
  <div class="box-gray">
    <div class="box-container">
      <el-form :model="input" :inline="true" ref="model" @keyup.enter.native="search" style="margin-top: 20px;"
               label-width="200px">
        <el-form-item label="提交人">
          <el-input v-model="input.Submitter" placeholder="请输入内容" clearable></el-input>
        </el-form-item>
        <el-form-item label="处理人">
          <el-input v-model="input.Handler" placeholder="请输入内容" clearable></el-input>
        </el-form-item>
        <el-form-item label="问题类型">
          <el-select v-model="input.questionType" placeholder="请选择" clearable>
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="是否需要返工">
          <el-select v-model="input.doYouNeedToRework" placeholder="请选择" clearable>
            <el-option v-for="item in whetherList" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="单据编号">
          <el-input v-model="input.documentNumber" placeholder="请输入内容" clearable></el-input>
        </el-form-item>
        <el-form-item label="工单编号">
          <el-input v-model="input.workOrderNumber" placeholder="请输入内容" clearable></el-input>
        </el-form-item>
        <el-form-item label="问题提交时间">
          <el-date-picker v-model="input.issueSubmissionTime" type="daterange" range-separator="至"
                          start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyyMMdd">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="问题处理时间">
          <el-date-picker v-model="input.problemProcessingTime" type="daterange" range-separator="至"
                          start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyyMMdd">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="问题结案时间">
          <el-date-picker v-model="input.questionClosingTime" type="daterange" range-separator="至"
                          start-placeholder="开始日期" end-placeholder="结束日期" value-format="yyyyMMdd">
          </el-date-picker>
        </el-form-item>
        <el-form-item style="margin-left: 100px;width: 100%">
          <el-button type="primary" @click="search3">三天内未结案</el-button>
          <el-button type="primary" @click="search">搜索</el-button>
          <el-button type="danger" @click="reset">重置</el-button>
          <el-button @click="cancel">取消</el-button>
        </el-form-item>
      </el-form>
      <div class="line-gray"></div>
      <div class="box-container-bottom">
        <el-table :data="tableData" @selection-change="handleSelectionChange" @row-click="rowClick" ref="multipleTable"
                  border style="width: 100%;">

          <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
          <el-table-column label="操作"
                           align="center">

            <template slot-scope="scope">
              <el-button type="primary" @click="info(scope.row)">操作</el-button>
            </template>
          </el-table-column>
          <el-table-column label="提交人"
                           prop="proposer"
                           header-align="center"
                           align="center"
                           show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="处理人" prop="handler" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="问题类型"
                           prop="lx"
                           header-align="center"
                           align="center"
                           :formatter="lxFormatter"
                           show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="是否需要返工"
                           prop="rework"
                           header-align="center"
                           align="center"
                           :formatter="reworkFormatter"
                           show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="是否关闭问题"
                           prop="isfinish"
                           header-align="center"
                           align="center"
                           :formatter="isfinishFormatter"
                           show-overflow-tooltip>
          </el-table-column>
          <el-table-column label="销售订单号" prop="xsddh" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="成品料号" prop="cplh" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="批量" prop="pl" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="产品规格" prop="cpgg" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="选择记录" prop="xzj" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="单据编号" prop="fbillno" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="工单编号" prop="gdbh" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="原因" prop="reson" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="问题描述" prop="wtms" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="问题提交时间" prop="begintime" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="问题处理时间" prop="handeltime" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="问题结案时间" prop="endtime" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="品质审核人" prop="pzshr" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="问题上报" prop="wtsb" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
          <el-table-column label="问题实施人" prop="wtssr" header-align="center" align="center"
                           show-overflow-tooltip></el-table-column>
        </el-table>
<!--        问题处理弹窗-->
        <info-dialog v-if="dialogVisible"
              ref="infoDialog"
              :operation="operation">
        </info-dialog>
        <!--        <el-pagination ref="pagination" @size-change="handleSizeChange" @current-change="handleCurrentChange"-->
        <!--                       :current-page.sync="page.pageIndex" :page-sizes="pageSizes" :total="total"-->
        <!--                       :page-size="page.pageSize" layout="total, sizes, pager, prev, next" prev-text="上一页"-->
        <!--                       next-text="下一页"></el-pagination>-->
      </div>
    </div>
  </div>
</template>

<script>
// import { getPage, getPageSizes } from '../utils/table'
import axios from "axios";
import infoDialog from "./info"

export default {
  components: {infoDialog},
  data() {
    return {
      operation: '',
      dialogVisible: false,
      input: {
        Submitter: '',
        Handler: '',
        questionType: '',
        doYouNeedToRework: '',
        documentNumber: '',
        workOrderNumber: '',
        issueSubmissionTime: [],
        problemProcessingTime: [],
        questionClosingTime: []
      },
      isfinishList: [
        {value: '1', label: '是'},
        {value: '0', label: '否'}
      ],
      whetherList: [
        {value: '1', label: '是'},
        {value: '0', label: '否'}
      ],
      //后期更改类型后需要在这更改Value字段
      options: [
        {value: '0', label: '软件'},
        {value: '1', label: '操作'},
        {value: '2', label: '来料'},
        {value: '3', label: '工艺'},
        {value: '4', label: '信息判断'},
        {value: '5', label: '工作质量'},
        {value: '6', label: '硬件'},
        {value: '7', label: '结构'},
      ],
      tableData: [],
      total: 1
      // pageSizes: getPageSizes()
    }
  },
  methods: {
    checkDetail(val) {
      console.log(this.dialogVisible)
      console.log(val)
    },
    //更改“类型”显示内容
    lxFormatter(row) {
      if (row.lx === 0) {
        return '软件'
      }
      if (row.lx === 1) {
        return '操作'
      }
    },
    //更改“是否返工”显示内容
    reworkFormatter(row) {
      if (row.rework === 0) {
        return '否'
      }
      if (row.rework === 1) {
        return '是'
      }
    },
    //更改“是否关闭问题”显示内容
    isfinishFormatter(row) {
      if (row.isfinish === 0) {
        return '否'
      }
      if (row.isfinish === 1) {
        return '是'
      }
    },
    handleSizeChange(val) {
      this.page.pageSize = val
      this.page.pageIndex = 1
      this.getList()
    },
    handleCurrentChange(val) {
      this.page.pageIndex = val
      this.getList()
    },
    info(val) {
      this.dialogVisible=true
      this.checkDetail(val)
      this.operation=val
      this.$refs.infoDialog.init()
    },
    getList() {
      let search = {
        'proposer': this.input.Submitter,			//提交人
        'handler': this.input.Handler,			//处理人
        'lx': this.input.questionType,		//问题类型
        'rework': this.input.doYouNeedToRework,	//是否需要返工
        'fbillno': this.input.documentNumber,	//单据编号
        'gdbh': this.input.workOrderNumber,	//工单编号
        'beginTimeStart': this.input.issueSubmissionTime.length > 0 ? this.input.issueSubmissionTime[0] + ' 00:00:00' : '',
        'beginTimeEnd': this.input.issueSubmissionTime.length > 0 ? this.input.issueSubmissionTime[1] + ' 23:59:59' : '',
        'handelTimeStart': this.input.problemProcessingTime.length > 0 ? this.input.problemProcessingTime[0] + ' 00:00:00' : '',
        'handelTimeEnd': this.input.problemProcessingTime.length > 0 ? this.input.problemProcessingTime[1] + ' 23:59:59' : '',
        'endTimeStart': this.input.questionClosingTime.length > 0 ? this.input.questionClosingTime[0] + ' 00:00:00' : '',
        'endTimeEnd': this.input.questionClosingTime.length > 0 ? this.input.questionClosingTime[1] + ' 23:59:59' : ''
      }
      //查询的数据地址
      axios.get('http://localhost:8081/test', {
        params: {
          proposer: search.proposer,    //提交人
          handler: search.handler,			//处理人
          lx: search.lx,		//问题类型
          rework: search.rework,	//是否需要返工
          fbillno: search.fbillno,	//单据编号
          gdbh: search.gdbh,	//工单编号
          beginTimeStart: search.beginTimeStart,
          beginTimeEnd: search.beginTimeEnd,
          handelTimeStart: search.handelTimeStart,
          handelTimeEnd: search.handelTimeEnd,
          endTimeStart: search.endTimeStart,
          endTimeEnd: search.endTimeEnd
        }
      })
        .then(response => (this.tableData = response.data.data))
    },
    //搜索
    search() {
      // this.page.pageIndex = 1
      this.getList()
    },
    //搜索三天内未结案
    search3() {
      axios.get('http://localhost:8081/test/3no', {})
        .then(response => (this.tableData = response.data.data))
    },
    //重置
    reset() {
      this.input = {
        Submitter: '',
        Handler: '',
        questionType: '',
        doYouNeedToRework: '',
        documentNumber: '',
        workOrderNumber: '',
        issueSubmissionTime: [],
        problemProcessingTime: [],
        questionClosingTime: []
      }
    },
    //取消
    cancel() {
      this.tableData=null
    },
  }
  ,
}
</script>

<style scoped>

</style>
